<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>用户列表</title>
	<link href="../css/themes/default/easyui.css" rel="stylesheet" />
	<link href="../css/themes/icon.css" rel="stylesheet" />
	<link href="../css/themes/color.css" rel="stylesheet" />
	<script src="../script/jquery.min.js"></script>
	<script src="../script/jquery.easyui.min.js"></script>
	<script src="../script/easyui-lang-zh_CN.js"></script>
	<script src="../script/commom.js"></script>
	<script type="text/javascript">
		var types=
		[
			{type:1,name:"学生"}	,
			{type:2,name:"老师"}	,
			{type:3,name:"专家"}	,
			{type:4,name:"主管"}	,
			{type:5,name:"实验室管理员"}	,
			{type:6,name:"超级管理员"},
			{type:7,name:"校外人员"}	
		];
		var sexs=[{sex:"男"},{sex:"女"}];
        $(function () {
            loadData();
            $("#btnSerach").click(search);
        });
		function search(){
			var pars={
				name:$("#name").val(),
				sex:$('#sex').combobox('getValue'),
				type:$('#type').combobox('getValue')
			};
			loadData(pars);
		}
        function loadData(pars) {
            $('#data').datagrid({
                url: 'http://localhost:8080/libManager/user/find.do',
                //width: 1000,
                //height: 400,
				contentType: "multipart/form-data;charset=UTF-8",
                width: ($(window).width()*0.90), 
                height:($(window).height()*0.99)-100, 
                //fit:true,
                fitColumns: true, //列自适应
                nowrap: false,
                idField: 'id',//主键列的列名
                loadMsg: '正在加载信息...',
                pagination: true,//是否有分页
                singleSelect: true,//是否单行选择
                pageSize: 10,//每页多少条数据
                pageNumber: 1,//默认的页
                pageList: [10, 20, 30],
				// onClickCell: onClickCell,
                queryParams: pars,//往后台传递参数
                columns: [[
                    {
                        field: 'id', title: '账号', width: 100, align: 'center'
                    },
                    { field: 'name', title: '姓名', align: 'center', width: 100,editor:{type:'validatebox',options:{required:true}}},
                    { field: 'birth', title: '生日', align: 'center', width: 100,editor: {type:'datebox',options:{required:true,validType:'validDate[\'yyyy-MM-dd\']' }}  
					},
					  { field: 'sex', title: '性别', align: 'center', width: 100,editor:{
							type:'combobox',
							options:{
								valueField:'sex',
								textField:'sex',
								data:sexs,
								required:true,
								validType:"sex"
							}
						}},
					  { field: 'idCard', title: '身份证号码', align: 'center', width: 100,editor:{type:'validatebox',options:{required:true,validType:"idcard"}}},
					  { field: 'type', title: '职位', align: 'center', width: 100 ,
					  formatter: function (value, row, index) {
					      var str = "";
						  switch(parseInt(value))
						  {
							  case 1:
							  str="学生";
							  break;
							  case 2:
							  str="老师";
							  break;
							  case 3:
							  str="专家";
							  break;
							  case 4:
							  str="主管";
							  break;
							  case 5:
							  str="实验室管理员";
							  break;
							  case 6:
							  str="超级管理员";
							  break;
							  case 7:
							  str="校外人员";
							  break;
						  }
					      return str;
					  },editor:{
							type:'combobox',
							options:{
								valueField:'type',
								textField:'name',
								data:types,
								required:true
							}
						}},
					  { field: 'address', title: '现在住址', align: 'center', width: 100 ,editor:{type:'validatebox',options:{required:true}}},
					  { field: 'phoneNumber', title: '手机号码', align: 'center', width: 100,editor:{type:'validatebox',options:{required:true,validType:"mobile"}}},
					  { field: 'email', title: '邮箱', align: 'center', width: 100,editor:{type:'validatebox',options:{required:false,validType:"email"}}},
                      {
                          field: 'operation', title: '操作', align: 'center', width: 100,
                          formatter: function (value, row, index) {
							if (row.editing){
								var s = '<a href="javascript:void(0)" onclick="saverow(this)">保存</a> ';
								var c = '<a href="javascript:void(0)" onclick="cancelrow(this)">取消</a>';
								return s+c;
							} else {
								var e = '<a href="javascript:void(0)" onclick="editrow(this)">编辑</a> ';
								var d = '<a href="javascript:void(0)" onclick="deleterow(this)">删除</a>';
								return e+d;
							}
                          }
                      }
                ]],
				onBeforeEdit:function(index,row){
					row.editing = true;
					$(this).datagrid('refreshRow', index);
				},
				onAfterEdit:function(index,row){
					row.editing = false;
					$(this).datagrid('refreshRow', index);
					updateActions(index,row)
				},
				onCancelEdit:function(index,row){
					row.editing = false;
					$(this).datagrid('refreshRow', index);
				},
// 				onAfterEdit:function (index, row, changes) 
// 				{
// 					$.ajax({
// 						url : '要改变后台数据的controller路径?fieId1='+row.属性1,
// 						data:{fieId2:row.fieId}, //额外的参数
// 						dataType: "text",//响应结果为文本
// 						success:function (data) 
// 						{
// 							$.messager.alert('消息', data);
// 						}
// 						});
// 				}
                //toolbar: [{
                //    id: 'btnAdd',
                //    text: '添加',
                //    iconCls: 'icon-add',
                //    handler: function () {

                //    }
                //}],
            });
        }
		function deleterow(target){
			$.messager.confirm('Confirm','是否删除该数据?',function(r){
				if (r){
					var jsonData = JSON.stringify($("#data").datagrid('getSelected',getRowIndex(target)));// 转成JSON格式
					$.ajax({
						type:"post",
						contentType :'application/json;charset=utf-8',
						dataType:"json",  //数据格式设置为jsonp
						// jsonp:"callback",  //Jquery生成验证参数的名称
						url : 'http://localhost:8080/libManager/user/delete.do',
						data:jsonData, //额外的参数
						success:function (data) 
						{
							if(data.status==1)
							{
								search();
							}else
							{
							}
							$.messager.alert('系统提示', data.msg);
						}
					});
				}
			});
		}
		function updateActions(index,row){
			$.ajax({
				type:"post",
				contentType :'application/json;charset=utf-8',
				dataType:"json",  //数据格式设置为jsonp
				// jsonp:"callback",  //Jquery生成验证参数的名称
				url : 'http://localhost:8080/libManager/user/update.do',
				data:JSON.stringify(row), //额外的参数
				success:function (data) 
				{
					if(data.status==1)
					{
						
					}else
					{
					}
					$.messager.alert('系统提示', data.msg);
				}
			});
		}
    </script>
    <style>
        body{
            font-size:12px;
            overflow-y:hidden;
        }
        input{
            width:100px;            
        }
        select{
            width:104px;
        }
        #sec{
            /*border:1px solid #0094ff;*/
            width:1000px;
            
        }
        #sec td{
            width:100px;
            height:20px;
            text-align:right
        }
    </style>
</head>
<body >
    <div>
        <table id="sec"  >
			<tr>
				<td>姓名:</td>
				<td><input type="text" class="easyui-textbox" id="name" name="name" value="" /></td>
				<td>性别:</td>
				<td><select name="sex" class="easyui-combobox" id="sex" >
					<option value="">全部</option>
				    <option value="男">男</option>
				    <option value="女">女</option>
				</select></td>
				<td>职位:</td>
				<td><select name="type" class="easyui-combobox" id="type" >
					<option value="">全部</option>
					<option value="1">学生</option>
					<option value="2">老师</option>
					<option value="3">专家</option>
					<option value="4">主管</option>
					<option value="5">实验室管理员</option>
					<option value="6">超级管理员</option>
					<option value="7">校外人员</option>
				</section></td>
                <td>
                    <a href="javascript:void(0)" id="btnSerach" class="easyui-linkbutton c1" style="width:70px">查询</a>
                </td>
            </tr>
        </table>
    </div>
    <table id="data" >        
    </table>
</body>
</html>
